<% layout('/layouts/default.html', {title: '文件归还', libs: ['dataGrid']}){ %>

<div class="main-content">
    <div class="box box-main" >
        <div class="box-body"  >
            <form id="inputForm" action="${ctx}/sd/docDeliverRecord/returnDoc">
                <input type="hidden" name="pictureSrc" id="pictureSrc">
                <input id="userCode"  name="userCode"  type="hidden" />
                <div class="row">
                    <div class="col-xs-8">
                        <div class="row mb10">
                            <div class="col-xs-6">
                                <div class="form-group">
                                    <label class="control-label col-sm-4" title="">
                                        <span class="required hide">*</span> ${text('二维码信息')}：<i
                                            class="fa icon-question hide"></i></label>
                                    <div class="col-sm-8">
                                        <input id="fileInfo" type="password" class="form-control width-260" autocomplete="off" placeholder="请将光标置于此处扫描文件二维码"
                                               value=""/>
                                    </div>
                                </div>
                            </div>


                            <div class="col-xs-6">
                                <div class="form-group">
                                    <label class="control-label col-sm-4">${text('还文人姓名')}：</label>
                                    <i class="fa icon-question hide"></i></label>
                                    <div class="col-sm-8">
                                        <input id="userName" placeholder="扫描文件后自动填充" autocomplete="off" onchange="tempReturn()" name="userName" class="form-control width-260"/>
                                    </div>
                                </div>
                            </div>


                        </div>

                        <div class="row mt20">
                            <div class="col-xs-6">
                                <div class="form-group">
                                    <label class="control-label col-sm-4">${text('还文人警号')}：</label>
                                    <i class="fa icon-question hide"></i></label>
                                    <div class="col-sm-8">
                                        <input id="policeNo" placeholder="扫描文件后自动填充" autocomplete="off" name="policeNo" class="form-control width-260"/>
                                    </div>
                                </div>
                            </div>
                            <div class="col-xs-6">
                                <div class="form-group">
                                    <label class="control-label col-sm-4">${text('操作员密码')}：</label>
                                    <i class="fa icon-question hide"></i></label>
                                    <div class="col-sm-8">
                                        <input id="password" autocomplete="off" type="password" name="password" placeholder="请输入当前登录用户密码!" class="form-control width-260"/>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-xs-4 pt30">
                        <div id="uploadImg" class="col-xs-12 hide">
                            <div class="form-group">
                                <div class="col-sm-5">
                                    <img id="showImg"  src="${ctxStatic}/camera.jpg" class="img-responsive img-circle" alt="Responsive image" onclick="collectPicture()">
                                </div>
                                <label class="control-label col-sm-7">
                                </label>
                            </div>
                        </div>
                    </div>
                </div>



                <div class="ml10 mr10" style="max-height: 80%;">
                    <h4 class="form-unit">${text('待还文件列表')}</h4>

                    <table id="dataGrid" ></table>
                   <!-- <div id="dataGridPage"></div>-->
                </div>


            </form>


        </div>
        <form id="searchForm" action="${ctx}/sd/docDeliverRecord/getNull"></form>
    </div>
</div>
<% } %>
<script>
    //初始化测试数据子表DataGrid对象
    $("#dataGrid").dataGrid({
        searchForm: $("#searchForm"),
        data: {},
        //datatype: "local", // 设置本地数据
        autoGridHeight: function () {
            return 'auto'
        }, // 设置自动高度
        // 设置数据表格列
        columnModel: [
            {
                header: '主键', name: 'id', editable: true, hidden: true, unformat: function (val, obj, cell) {
                    return $('#' + obj.rowId + '_' + obj.colModel.name, cell).val();
                }
            },
            {
                header: '${text("来文标题")}',
                name: 'fileTitle',
                editable: false,
                width: 150,
                align: "left"

            },
            {header: '${text("来文文号")}', name: 'fileNo', editable: false, width: 150, align: "left"},
            {header: '${text("领文单位")}', name: 'takeUnitName', editable: false, width: 150, align: "left"},
            {
                header: '${text("操作")}',
                name: 'actions',
                width: 60,
                sortable: false,
                fixed: true,
                formatter: function (val, obj, row, act) {
                    var actions = [];
                    if (val == 'new') {
                        actions.push('<a href="#" onclick="js.confirm(\'${text("你确认要删除这条数据吗？")}\', function(){$(\'#dataGrid\').dataGrid(\'delRowData\',\'' + obj.rowId + '\')});return false;"><i class="fa fa-trash-o"></i></a>&nbsp;');
                    } else {
                        actions.push('<a href="#" onclick="js.confirm(\'${text("你确认要删除这条数据吗？")}\', function(){$(\'#dataGrid\').dataGrid(\'setRowData\',\'' + obj.rowId + '\',null,{display:\'none\'});$(\'#' + obj.rowId + '_status\').val(\'' + Global.STATUS_DELETE + '\');});return false;"><i class="fa fa-trash-o"></i></a>&nbsp;');
                    }
                    return actions.join('');
                },
                editoptions: {defaultValue: 'new'}
            }
        ],
        // 编辑表格参数
        editGrid: false,				// 是否是编辑表格
        editGridInitRowNum: 0,		// 编辑表格的初始化新增行数
        ajaxSuccess: function (data) {
        }
    });
    /*进入页面焦点就在这个输入框中*/
    $("#fileInfo").focus();

    $(document).keyup(function (event) {
        if (event.keyCode == 13) {
            getReturnDocInfo($("#fileInfo").val());
        }
    });

    /**
     * c
     * @param docId
     */
    function getReturnDocInfo(fileId) {

        js.ajaxSubmit('${ctx}/sd/docDeliverRecord/getReturnDocInfo', {'fileId': fileId},
            function (data) {
                if (data.result == Global.TRUE) {
                    //data.data 是文件需要展示是信息
                    var info = data.data;

                    var id = data.data.recordId;
                    var rows = $('#dataGrid').dataGrid('getRowData');
                    for (var i =0; i<rows.length;i++) {
                        if (id === rows[i].id){
                            js.layer.msg('当前文件已在列表中,请勿重复添加!', {icon: 5});
                            $("#fileInfo").val('')
                            $("#fileInfo").focus();
                            return;
                        }
                    }
                    //往列表中写值
                    $('#dataGrid').jqGrid('addRow', {
                        position: 'last',
                        addRowParams: {keys: true, focusField: true},
                        initdata: {
                            id: info.recordId,
                            fileTitle: info.fileTitle,
                            fileNo: info.fileNo,
                            takeUnitName: info.takeUnitName,
                            status: Global.STATUS_NORMAL
                        }
                    });
                    // 给输入框写值
                    if ($('#dataGrid').dataGrid('getRowData').length === 1) {

                        $('#userName').val(info.userName);
                        $('#userCode').val(info.userCode);
                        $('#policeNo').val(info.policeNo);
                        $('#policeNo').attr('readonly','readonly');
                        $('#uploadImg').addClass('hide');
                    }
                    js.layer.msg(data.message, {icon: 1});
                } else {
                    js.layer.msg(data.message, {icon: 5});
                }

                $("#fileInfo").val('')
                $("#fileInfo").focus();
            }, 'json', true, '正在查询文件信息..')

    }
function showUserInfo(id, act, index, layero, nodes) {
    let userCode = $('#testUserCode').val();
    if (act === 'ok') {
        js.ajaxSubmit("${ctx}/sd/docDeliverRecord/getUserInfoByCode?userCode=" + userCode, function (data) {
            $('#normalPoliceNo').val(data.extend.extendS1);
            $('#normalImg').val(data.extend.extendS3);

        }, null, null, js.text(""))
    }else if(act === 'clear'){
        $('#normalPoliceNo').val('');
        $('#normalImg').val('');
    }
}
</script>

<script>
    function collectPicture(){
        var index =js.layer.open({
            type: 2,
            area: [(js.layer.window.outerWidth-600)+'px',(js.layer.window.outerHeight-200)+'px'],
            title: '${text("录入人脸")}',
            resize: false,
            scrollbar: true,
            maxmin:true,
            content: '${ctx}/sd/collectPicture/form',
            success: function(layero, index){

            },
            btn: ['<i class="fa fa-check"></i> ${text("提交")}',
                '<i class="fa fa-remove"></i> ${text("关闭")}'],
            btn1: function(index, layero){
                var win = layero.iframeWindow();
                var form = {
                    inputForm: win.$('#pictureForm'),
                    btnSubmit: win.$('#btnSubmit'),
                };
                if (typeof(win.getFile()) == "undefined"){
                    js.layer.msg('请先拍照再提交!', {icon: 5});
                    return false;
                }
                let url = win.getUrl();
                console.log(url);
                $('#showImg').attr("src",url);

                let formData = new FormData;
                formData.append("file", win.getFile())
                $.ajax({
                    type: "POST",
                    url: "${ctx}/sd/collectPicture/uploadFile",
                    data: formData,
                    contentType: false,
                    processData: false,
                    success: function (data) {
                        if(data.result===Global.TRUE){
                            js.layer.msg(data.message, {icon: 1});
                            js.layer.close(index);
                            $('#pictureSrc').val(data.data);
                            return true;
                        }else {
                            js.layer.msg(data.message, {icon: 5});
                            return false;
                        }

                    }
                })

                return false;
            }
        });
    }

    function tempReturn() {
        $('#userCode').val('');
        $('#policeNo').val('');

        $('#policeNo').removeAttr('readonly');
        $('#policeNo').attr('placeholder',"当前为临时还文,需点击录入人脸信息!");
        $('#uploadImg').removeClass('hide');
    }
</script>
